<template>
    <div class="app-container">
        <wms-form v-model:query-params="queryParams" :form-list="formList" @query="getList" label-width="88px"
            @export="handleExport">
            <el-col :span="1.5">
                <el-button type="success" plain icon="Setting" :disabled="multiple" @click="stockPrepare"
                    v-hasPermi="['wms:obMaster:stock-prepare']">自动备货
                </el-button>
                <el-button type="warning" plain icon="RefreshLeft" :disabled="multiple" @click="cancelPrepare"
                    v-hasPermi="['wms:obMaster:cancel-prepare']">取消备货
                </el-button>
                <el-button type="success" plain icon="Promotion" :disabled="multiple" @click="outExecute"
                    v-hasPermi="['wms:obMaster:auto-execute']">出库执行
                </el-button>
            </el-col>
        </wms-form>

        <wms-table class="table-click" :loading="loading" :data-list="obMasterList" :column="column"
            :columnResize="true" :pageInfo="queryParams" @get-list="getList" @selection-change="selectionChange"
            @row-click="handleRowClick" />
        <ob-detail v-if="showDetail" v-model="showDetail" :master-info="masterInfo" />
    </div>
</template>

<script setup name="obMasterSales">
import WmsTable from '@/components/WmsTable/index.vue'
import WmsForm from '@/components/WmsForm/index.vue'
import ObDetail from '../obDetails/index.vue'
import { data, column, formList } from './index.js'
import { listObMaster, autoAllocation, executeAllocation, cancelAllocation } from "@/api/wms/obMaster";
import { ref, reactive, getCurrentInstance, onMounted } from "vue";

const { proxy } = getCurrentInstance();
const queryParams = reactive(data.queryParams);
const obMasterList = ref([]);
const obDetailList = ref([]);
const selectedMasters = ref([]);
const single = ref(true);
const loading = ref(true);
const showSearch = ref(true);

/** 查询生产出库单列表 */
function getList() {
    loading.value = true;
    queryParams.obMasterType = 'ERP_SALES_OUT'
    listObMaster(proxy.addDateRange(queryParams, queryParams.dateRange)).then(response => {
        obMasterList.value = response.rows;
        queryParams.total = response.total;
        loading.value = false;
    });
}

/** 搜索按钮操作 */
function handleQuery() {
    queryParams.pageNum = 1;
    getList();
}

/** 重置按钮操作 */
function resetQuery() {
    dateRange.value.dateRange = [];
    proxy.resetForm("queryRef");
    handleQuery();
}

/** 导出按钮操作 */
function handleExport() {
    proxy.download('wms/oBmaster/export', {
        ...queryParams
    }, `oBmaster_${new Date().getTime()}.xlsx`)
}

// 多选框选中数据
function selectionChange(selection) {
    single.value = selection.length != 1;
    // multiple.value = !selection.length;
    selectedMasters.value = selection;
}
const multiple = computed(() => !selectedMasters.value.length)

const obMasterIds = computed(() => selectedMasters.value.map(item => item.obMasterId))


/**
 * 对单据的备货相关操作
 * @param {string} dealType - 操作的类型
 * @param {string} dealApi - 操作的接口名
 * @param {array} allowStatusList - 允许执行该操作对应的单据状态
 */
function obMasterDeal(dealType, dealApi, allowStatusList) {
    const allow = selectedMasters.value.every(item => allowStatusList.includes(item.obMasterStatus))
    if (!allow) return proxy.$modal.msgError(`所选主单存在无法${dealType}的数据！请核查相关单据状态！`)
    proxy.$modal.confirm(`确认要执行${dealType}操作吗?`).then(function () {
        // 操作接口
        return dealApi({ obMasterIds: masterIds.value });
    }).then((res) => {
        console.log(res);
        proxy.$modal.msgSuccess(`所选单据${dealType}成功`);
        getList()
    }).catch(() => {
    });
}

function stockPrepare() {
    obMasterDeal('自动备货', autoAllocation, [0, 1])
}

function cancelPrepare() {
    obMasterDeal('取消备货', cancelAllocation, [1, 2])
}

function outExecute() {
    obMasterDeal('出库执行', executeAllocation, [1, 2])
}

let showDetail = ref(false)
let masterInfo = ref({})

const handleRowClick = (row) => {
    showDetail.value = true
    masterInfo.value.obMasterId = row.obMasterId
    masterInfo.value.obMasterNo = row.obMasterNo
}
getList();
</script>
